<template>
  <div class="p-2">
    <el-tabs
      v-if="checkRole(6)"
      v-model="tabsActive"
      @tab-click="tabClick"
    >
      <el-tab-pane
        name="1"
        label="用工签约"
      >
        <headerStep @getList="queryList"></headerStep>
      </el-tab-pane>
      <el-tab-pane
        name="2"
        label="用工查询"
      >
        <business-table></business-table>
      </el-tab-pane>
    </el-tabs>
    <template v-if="checkRole([5,9])">
      <div class="mb-[10px]">
        <headerStep  @getList="queryList"></headerStep>
      </div>
      <business-table ref="busTable"></business-table>
    </template>
  </div>
</template>

<script setup name="employmentContract" lang="ts">
import { checkRole } from '@/utils/permission'; // 权限判断函数
import businessTable from '../components/businessTable.vue';
import headerStep from '../components/headerStep.vue';
import { TabsPaneContext } from 'element-plus';

const tabsActive = ref<string | number>('2');
const busTable = ref();
const tabClick = (pane: TabsPaneContext) => {
  if (pane.props.name == tabsActive.value) return;
  tabsActive.value = pane.props.name || '';
};

const queryList = ()=>{
    busTable.value.getList();
}

onMounted(() => {});
</script>

<style lang="scss" scoped>
</style>
